<template>
	<div class="tobeDone">
		<tableIndex
			ref="tableRef"
			:tableData="tableData"
			:tableHead="tableHead"
			:isIndex="true"
			:isSelection="false"
			:isRadio="false"
			:fields="fields"
			:height="500"
			:page="page"
			@selectChange="selectChange"
			@searchList="searchList"
			@page-change="pageChange"
		>
			<template #btns>
				<div style="float: right">
					<el-button
						size="small"
						plain
						class="update"
						@click="onExport({ ...getSearchData() })"
						>导出</el-button
					>
				</div>
			</template>

			<template #operate>
				<el-table-column label="操作" width="200" fixed="right" align="center">
					<template #default="{ row }">
						<el-button
							v-if="
								!(
									row.isOverdue == 0 ||
									row.auditStatus == 2 ||
									row.auditStatus == 1
								)
							"
							size="small"
							class="report"
							@click="reportHandler(row)"
							type="primary"
							>上报</el-button
						>
						<el-button
							size="small"
							class="audit"
							@click="lookHandler(row)"
							type="primary"
							>查看</el-button
						>
						<el-button
							size="small"
							class="complete"
							@click="overHandler(row)"
							type="primary"
							v-if="
								(row.isOverdue == 0 ||
									(row.isOverdue == 1 && row.auditStatus == 2)) &&
								row.statusName !== '完成'
							"
							>完成</el-button
						>
					</template>
				</el-table-column>
			</template>

			<template #approve>
				状态
				<el-button size="small" plain class="update">查看</el-button>
			</template>
		</tableIndex>

		<!-- 完成弹框 -->
		<overDialog ref="overdialog" @refreshList="getPage"></overDialog>
		<!-- 上报弹框 -->
		<reportDialog ref="reportdialog" @refreshList="getPage"></reportDialog>
	</div>
</template>

<script setup>
import tableIndex from "@/components/table/index.vue";
import { taskSupervise, publicProject } from "@/api/project";
import { useRouter } from "vue-router";
import { ref, onMounted, reactive } from "vue";
import { deriveHandelFnc } from "@/hooks/downCommon";

import overDialog from "@/views/constructionProjectManage/mytobeDone/components/overDialog.vue";
import reportDialog from "@/views/constructionProjectManage/mytobeDone/components/reportDialog.vue";
import { ElButton, ElInput, ElMessageBox, ElMessage } from "element-plus";
const page = reactive({
	page: 1,
	pageSize: 10,
	total: 0,
});
const fields = ref([
	{
		key: "keywords",
		label: "项目任务名称",
		type: "input",
		placeholder: "项目任务名称搜索",
	},
	{
		key: "projectTypeId",
		label: "项目类型",
		type: "select",
		options: {
			list: [],
		},
	},
]);
let tableData = ref([]);
let tableRef = ref([]);
let tableHead = ref([
	{
		prop: "projectName",
		label: "项目",
		width: "180",
	},
	{
		prop: "taskName",
		label: "任务名称",
		width: "120",
	},
	{
		prop: "taskCode",
		label: "任务代码",
	},
	{
		prop: "isMilestone",
		label: "里程碑",
		isSvg: ["lcb_true", "lcb_false"],
	},
	{
		prop: "taskType",
		label: "任务类型",
		formatter: (row) => {
			return row.taskType === 1
				? "招标任务"
				: row.taskType === 2
				? "投资任务"
				: "租赁任务";
		},
	},
	{
		prop: "taskContent",
		label: "工作细项",
	},
	{
		prop: "auditStatus",
		label: "审核状态",
		formatter: (row) => {
			let str = "";
			switch (row.auditStatus) {
				case "":
					str = "";
					break;
				case 1:
					str = "审核中";
					break;
				case 2:
					str = "审核通过";
					break;
				case 3:
					str = "驳回";
					break;

				default:
					break;
			}
			return str;
		},
	},
	{
		prop: "statusName",
		label: "作业状态",
	},
	{
		prop: "planStartTime",
		label: "计划开始时间",
	},
	{
		prop: "planEndTime",
		label: "计划完成时间",
	},
	{
		prop: "problemRemark",
		label: "存在的问题及其困难",
	},
	{
		prop: "isInExecute",
		label: "是否内部执行",
		formatter: (row) => {
			return row.isInExecute === 1 ? "是" : "否";
		},
	},
	{
		prop: "responsibleUserName",
		label: "责任人",
	},
	{
		prop: "responsibleDepartmentName",
		label: "责任部门",
	},
	{
		prop: "isOverdue",
		label: "是否超期",
		formatter: (row) => {
			return row.isOverdue === 1 ? "是" : "否";
		},
	},
	{
		prop: "realStartTime",
		label: "实际开始时间",
	},
	{
		prop: "realEndTime",
		label: "实际完成时间",
	},
	// {
	//   prop: 'auditStatus',
	//   label: '业务审批状态',
	//   slot: 'approve'
	// },
	// {
	//   prop: 'topic',
	//   label: '议题状态',
	//   slot: 'topic'
	// },
	// {
	//   prop: 'createTime',
	//   label: '服务商推荐',
	//   slot: 'service'
	// },
	// {
	//   prop: 'createTime',
	//   label: '合同初稿',
	//   slot: 'contract'
	// }
]);
let activeName = ref("0");

const selectChange = (e) => {
	console.log(e);
};
const overdialog = ref(null);
const reportdialog = ref(null);
//完成按钮事件

const overHandler = (row) => {
	overdialog.value.state.centerDialogVisible = true;
	overdialog.value.state.projectTaskId = row.projectTaskId;
	overdialog.value.state.projectRow = row;
};
//上报
const reportHandler = (row) => {
	reportdialog.value.state.centerDialogVisible = true;
	reportdialog.value.state.projectTaskId = row.projectTaskId;
	reportdialog.value.state.projectRow = row;
	reportdialog.value.state.type = 0;
};
//获取搜索组件数据
const getSearchData = () => {
	return tableRef.value.getSearchData();
};
//查看
const lookHandler = (row) => {
	reportdialog.value.state.centerDialogVisible = true;
	reportdialog.value.state.projectRow = row;
	reportdialog.value.state.projectTaskId = row.projectTaskId;
	reportdialog.value.state.type = 1;
};
//路由跳转
let router = useRouter();

const exportConfig = reactive({
	fileName: "任务督办",
	apiPath: "taskDBExport",
	form: {},
});
const { onExport } = deriveHandelFnc(exportConfig);

// const approveHandel = (row) => {
//   router.push({
//     path: '/projectSupervision/approve'
//   })
// }
// const topicHandel = (row) => {
//   router.push({
//     path: '/projectSupervision/topic'
//   })
// }
// const serviceHandel = (row) => {
//   router.push({
//     path: '/projectSupervision/service'
//   })
// }
// const contractHandel = (row) => {
//   router.push({
//     path: '/projectSupervision/contract'
//   })
// }

//搜索接口请求
const searchList = (e) => {
	getPage(e);
};
//分页接口请求
const getPage = (e = {}) => {
	taskSupervise
		.getPageList({
			pageNum: page.page,
			pageSize: page.pageSize,
			param: getSearchData(),
		})
		.then((res) => {
			if (res.code == 200) {
				tableData.value = res.data.content;
				page.total = res.data.totalSize;
				console.log(tableData);
			}
		});
};
//分页
const pageChange = (e) => {
	console.log(e);
	page.page = e.page;
	page.pageSize = e.limit;

	getPage();
};
const getpublicProject = () => {
	publicProject.getProjectTypeVo("").then((res) => {
		if (res.code == 200) {
			res.data.forEach((item) => {
				fields.value[1].options.list.push({
					label: item.typeName,
					value: item.projectTypeId,
				});
			});
		}
	});
};
onMounted(() => {
	getPage();
	getpublicProject();
});
</script>

<style lang="scss" scoped>
.tobeDone {
	width: 100%;
	height: 100%;
}
</style>
